Let’s try out PlantUML#

PlantUML seems at first glance somewhat similar to Mermaid but with a wider function list.

Following instructions from Paul Dugas I set up a shortcode and added a js file to the assets>static folder.

Let’s see:

Image added from PlantUML server to local assets once I installed and setup local PlantUML server."

Hey that worked!

Code:

{{< plantuml id="example" >}}
David -> Nevin: J
{{< /plantuml >}}

The id created a <img id="plantuml-example"... tag.

Back to linked lists#

First some experimentation with sequences.

But wait#

The above PlantUML image is stored and pulled from http://www.plantuml.com/plantuml/img/ut99BCjCKT2rK_1BBSlCirBmuW80. That’s not ideal. I’d prefer to use a local server and output the image into my assets>images folder.

So for my MacOS following these instructions:

brew install --cask temurin
brew install graphviz

Then tried this in an *.md file.

@startuml
David -> Nevin: J
@enduml

No joy.

Install a previewer in VSCOde.#

I installed the PlantUML Previewer extension and it started to work. I have to create *.puml files.

Next step is to see how I can process these files into SVG, and save them into the images folder. Beginning to think maybe I’m over thinking the problem. Mightn’t it be easier to just create the images I want in an image editor.

But I know the answer to that already. I want something I can source control and also use git diff with. An image file won’t give me that.

So, I can experiment with *.puml files but can’t output the svg file yet.

And then, I managed to export the svg below with minimum hassle.

Hello World in PlantUML

Ok, I’ve found a stackoverflow question that shows some real promise in terms of me showing a linked list.

Database Schema from Stackoverflow

That’s enough for tonight. Educative’s Data Structures and Algorithms in Python awaits.